import QtQuick 2.12
import QtQuick.Controls 2.5
import QtQuick.Layouts 1.12 as QtLayout
import QtQuick.Window 2.12

import "./widgets" as Widgets
import "./layouts" as Layouts
import "../js/global.js" as JS_Global

Item {
    id: root

    property bool editMode: false

    signal back()
    signal showReport(string title, string time)

    Component.onCompleted: {
        combox.dateTo = JS_Global.now()
        combox.dateFrom = JS_Global.addDays(combox.dateTo, -2)

        loadAll()
        search()
    }

    onEditModeChanged: {
        layoutEditMode.visible = editMode
        layoutSearch.visible = !editMode
        layoutDateCombo.visible = !editMode

        layoutList.height = editMode ? (root.height * 0.5) : (root.height * 0.74)
    }

    function search() {
        var key = txtText.text
        var from = combox.dateFrom
        var to = combox.dateTo

        histoyModel.search(key, from, to)
    }

    function loadAll() {
        var today = JS_Global.now()
        var dt = new Date(today)

        histoyModel.clear()

        //...3天內
        appendData(JS_Global.addDays(today, -1), 1)
        appendData(JS_Global.addDays(today, -1), 2)
        appendData(JS_Global.addDays(today, -2), 3)
        //...7天內
        appendData(JS_Global.addDays(today, -4), 4)
        appendData(JS_Global.addDays(today, -6), 5)
        //...30天內
        appendData(JS_Global.addDays(dt, -9), 6)
        appendData(JS_Global.addDays(dt, -11), 7)
        appendData(JS_Global.addDays(dt, -15), 8)
        appendData(JS_Global.addDays(dt, -18), 9)
        appendData(JS_Global.addDays(dt, -26), 1)
        //...90天內
        appendData(JS_Global.addDays(dt, -33), 2)
        appendData(JS_Global.addDays(dt, -46), 3)
        appendData(JS_Global.addDays(dt, -52), 4)
        appendData(JS_Global.addDays(dt, -77), 5)
    }

    function appendData(date, count) {
        var name = parseInt(date.getFullYear())
                 + JS_Global._s2(date.getMonth()) + JS_Global._s2(date.getDate()) + "-001-00" + count

        histoyModel.append({"name":name, "dt": date, "shown": true, "chk": false})
    }

    function removeSelections() {
        histoyModel.removeSel()
    }

    //////////////////////////////
    Layouts.TopLayout {
        id: toolBar
        z: 100
        width: parent.width
        height: root.height * 0.1
        title: qsTr("历史报告")

        onClickedBack: root.back()
    }

    Item {
        width: parent.width
        height: parent.height - toolBar.height
        y: toolBar.height * 1.4

        Column {
            width: parent.width
            height: parent.height
            spacing: 12

            ///................. 編輯模式
            Item {
                id: layoutEditMode
                width: parent.width * 0.9
                height: root.height * 0.08
                visible: false

                Row {
                    anchors.horizontalCenter: parent.horizontalCenter
                    width: parent.width * 0.6
                    height: parent.height
                    spacing: parent.width * 0.1

                    Widgets.FlatButton {
                        width: parent.width * 0.5
                        height: parent.height
                        backgroundColor: "#FF8686"
                        text: qsTr("刪除")

                        onClicked: removeSelections()
                    }

                    Widgets.FlatButton {
                        width: parent.width * 0.5
                        height: parent.height
                        text: qsTr("退出編輯")

                        onClicked: root.editMode = false
                    }
                }

            }

            //.......... 第一行
            Row {
                id: layoutSearch
                anchors.horizontalCenter: parent.horizontalCenter
                width: parent.width * 0.9
                height: root.height * 0.08
                spacing: parent.width * 0.02

                Label {
                    width: parent.width * 0.2
                    height: parent.height
                    horizontalAlignment: Label.AlignHCenter
                    verticalAlignment: Label.AlignVCenter

                    text: qsTr("檢體編號")
                    font.pixelSize: height * 0.4
                }

                Widgets.BorderTextField {
                    id: txtText
                    width: parent.width * 0.6
                    height: parent.height
                }

                Image {
                    width: parent.height
                    height: width
                    fillMode: Image.PreserveAspectFit
                    source: "qrc:/image/ic_search.png"

                    MouseArea {
                        anchors.fill: parent
                        onClicked: {
                            loadAll()
                            search()
                        }
                        onPressed: parent.scale = 0.95
                        onReleased: parent.scale = 1.0
                    }
                }
            }

            //.......... 第二行
            Row {
                id: layoutDateCombo
                anchors.horizontalCenter: parent.horizontalCenter
                width: parent.width * 0.9
                height: root.height * 0.08
                spacing: parent.width * 0.02

                Label {
                    width: parent.width * 0.2
                    height: parent.height
                    horizontalAlignment: Label.AlignHCenter
                    verticalAlignment: Label.AlignVCenter

                    text: qsTr("時間區間")
                    font.pixelSize: height * 0.4
                }

                ComboBox {
                    id:combox
                    width: parent.width * 0.78
                    height: parent.height
                    currentIndex: 0

                    property date dateFrom
                    property date dateTo

                    model: ListModel {
                        id: cbItems
                        ListElement { text: qsTr("最近三天期間") }
                        ListElement { text: qsTr("最近七天期間") }
                        ListElement { text: qsTr("最近一個月期間") }
                        ListElement { text: qsTr("最近三個月期間") }
                        ListElement { text: qsTr("選擇期間") }  //index = 4
                    }
                    onCurrentIndexChanged: {
                        var days = 0
                        dateTo = JS_Global.now()

                        switch (currentIndex) {
                            case 1: days = -6; break; //7
                            case 2: days = -29; break; //30
                            case 3: days = -89; break; //90
                            case 0:
                            default: days = -2; break; //3
                        }

                        dateFrom = JS_Global.addDays(dateTo, days)

                        loadAll()
                        search()
                    }
                }
            }

            //.......... 第三行
            Item {
                id: layoutDateRange
                width: parent.width
                height: root.height * 0.06
                visible: (combox.currentIndex === 4 && !editMode)

                Row {
                    width: parent.width * 0.6
                    height: parent.height
                    anchors.centerIn: parent

                    Widgets.FlatButton {
                        id: btnDateFrom
                        width: parent.width * 0.44
                        height: parent.height
                        radius: 0
                        text: JS_Global.getDateString( combox.dateFrom )
                        onClicked: layoutDate.show(combox.dateFrom, 0)
                    }

                    Label {
                        width: parent.width * 0.12
                        height: parent.height
                        horizontalAlignment: Text.AlignHCenter
                        verticalAlignment: Text.AlignVCenter
                        font.pixelSize: height * 0.4
                        text: "~"
                    }

                    Widgets.FlatButton {
                        id: btnDateTo
                        width: parent.width * 0.44
                        height: parent.height
                        radius: 0
                        text: JS_Global.getDateString( combox.dateTo )
                        onClicked: layoutDate.show(combox.dateTo, 1)
                    }
                }
            }

            //.......... 第四行
            //================================= 数据列表 ====
            Rectangle {
                id: layoutList
                color: "transparent"

                border.color: "#2E75B6"
                border.width: 1
                anchors.horizontalCenter: parent.horizontalCenter
                width: parent.width * 0.9
                height: root.height * 0.5

                ListView {
                    anchors.horizontalCenter: parent.horizontalCenter
                    anchors.verticalCenter: parent.verticalCenter
                    width: parent.width - 2
                    height: parent.height - 2
                    clip: true

                    model: ListModel {
                        id: histoyModel

                        function search(name, dateFrom, dateTo) {
                            console.log("search data from ["+dateFrom+"] to ["+dateTo+"] by ["+name+"]")
                            var cnt = rowCount()
                            for (var i=cnt-1; i>-1; i--) {
                                var item = get(i);
                                if (JS_Global.isDateInRange(item.dt, dateFrom, dateTo)) {
                                    item.shown = true
                                    console.log(item.dt)
                                } else {
                                    //item.shown = false
                                    remove(i)
                                }

                                if (name && (item.name.indexOf(name)===-1)) {
                                    //item.shown = false
                                    remove(i)
                                }
                            }
                        }

                        function removeSel() {
                            var cnt = rowCount()
                            for (var i=cnt-1; i>-1; i--) {
                                var item = get(i);
                                if (item.chk) {
                                    remove(i)
                                }
                            }
                        }
                    }


                    delegate: Rectangle {
                        width: parent.width
                        height: root.height * 0.06
                        color: index % 2 == 0 ? "#ccc" : "#e1e1e1"
                        visible: shown

                        Text {
                            width: parent.width
                            height: parent.height
                            horizontalAlignment: Text.AlignHCenter
                            verticalAlignment: Text.AlignVCenter
                            font.pixelSize: height * 0.35
                            text: name

                            TapHandler {
                                 acceptedDevices: PointerDevice.Mouse | PointerDevice.Stylus
                                 onTapped: {
                                     if (!root.editMode) {
                                         showReport(name, JS_Global.getDateTimeString(dt))
                                     }
                                 }

                                 onLongPressed: root.editMode = true
                             }
                             TapHandler {
                                 acceptedDevices: PointerDevice.TouchScreen
                                 onTapped: {
                                     if (!root.editMode) {
                                         showReport(name, JS_Global.getDateTimeString(dt))
                                     }
                                 }
                                 onLongPressed: root.editMode = true
                             }
                        } //text

                        CheckBox {
                            visible: root.editMode
                            checkState: chk ? Qt.Checked : Qt.Unchecked
                            onClicked: {
                                chk = !chk
                            }
                        }
                    }

                    ScrollBar.vertical: ScrollBar {}

                } //---- ListView
            }
        }
    }

    //..............
    Layouts.DatePickLayout {
        id: layoutDate
        z: 999
        anchors.fill: parent
        visible: false

        onClickedYes: {
            var dt = getDate()
            console.log(eventCode, dt)

            if (0 === eventCode) {
                combox.dateFrom = dt
                btnDateFrom.text = JS_Global.getDateString( dt )
            } else if (1 === eventCode) {
                combox.dateTo = dt
                btnDateTo.text = JS_Global.getDateString( dt )
            }
        }
    }

}
